<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
<title>计算器</title>
<style>
	input{width: 86PX;}
	.num{width: 30px;}
	.ops{width: 30px;}
	.num0{width: 90px;}
</style>
</head>
<body>
	<div id="app">
		
		<input></br>
		<button>1</button><button>2</button><button>3</button></br>
		<button>4</button><button>5</button><button>6</button></br>
		<button>7</button><button>8</button><button>9</button></br>
		<button>0</button></br>
		<button>+</button><button>-</button><button>=</button>
	</div>
	<script>
		$(function(){
			//定义全局变量
			var x=0;
			var y=0;
			var op='';
			var sum=0;
			
			//数字0 变宽
			$('button').each(function(){
				isNaN($(this).text()) ?$(this).addClass('ops')
				:$(this).addClass('num');
				$(this).text()=='0' ? $(this).addClass('num0'):{}
					
				})
				//获取到所有数字类的按钮 显示单个数字
				$('button.num').click(function(){
					var content=$('input').val();
					$('input').val(content+$(this).text());
					
					// var content=$(this).text();
					// // $('input').val(content);
					
				})
				//获取操作符号 + -符号
				$('button.ops').click(function(){
					if($(this).text()=="="){
					//加 减 法 实现
					y=Number($('input').val());
					sum=eval(x+op+y)
					$('input').val(sum);

					}else{
						//op=点击的按钮
						op=$(this).text();
						x=Number($('input').val())
						$('input').val('')
						console.log(op+x);
					}
					
					
					
					
				})
			
			
			
		// 	//数字0 变宽
		// 	$('button').each(function(){
		// 		isNaN($(this).text()) ?$(this).addClass('ops')
		// 		:$(this).addClass('num');
		// 		$(this).text()=='0' ? $(this).addClass('num0'):{}
		
		// 		})
		
		
		})
	</script>
</body>
</html>
